<div class="dux-page-header am-cf">
    <div class="page-title">
        <a class="am-btn am-btn-primary" href="{url('index')}"> 发货单列表</a>
    </div>
    <div class="page-action">
        <a class="am-btn am-btn-danger" href="javascript:;" id="print"><i class="am-icon-print"></i> 打印</a>
    </div>
</div>
    <div class="dux-body">
    <div class="am-panel am-panel-default dux-panel">
        <div class="am-panel-hd">打印区域</div>
        <div class="am-panel-bd" id="printArea">

            <p></p>
            <table style="width:100%;height:10%;" border="0">
                <tbody>
                <tr class="firstRow">
                    <td><p
                            style="font-size:200%;text-align:center; display:block; overflow:hidden;">商品发货单</p></td>
                </tr>
                <tr></tr>
                <tr>
                    <td style="text-align:right;"><span style="font-size:120%;">{$info.order_no}</span>&nbsp;
                        &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</td>
                </tr>
                </tbody>
            </table>
            <table style="width:100%;margin:2.5% 0px 1% 0px;" border="0">
                <tbody>
                <tr class="firstRow" style="width:100%;">
                    <td style="width:50%;">收货人：{$info.receive_name}</td>
                    <td style="width:50%;">电话：{$info.receive_tel}</td>
                </tr>
                <tr style="width:100%;">
                    <td style="width: 50%; word-break: break-all;">收货地址:
                        {$info.receive_province}{$info.receive_city}{$info.receive_region}{$info.receive_address}
                    </td>
                    <td style="width: 50%; word-break: break-all;">配送公司：{$info.delivery_name}</td>
                </tr>
                <tr style="width:100%;">
                    <td style="width: 50%; word-break: break-all;">订单号：{$info.order_no}</td>
                    <td style="width:50%;">打印时间：{date('Y-m-d H:i:s')}</td>
                </tr>
                </tbody>
            </table>
            <h3 style="float: left; margin-top: 0;">商品清单</h3>
            <table style="text-align:center;" class="goodslist" border="1" cellspacing="0" width="100%">
                <tbody>
                <tr class="firstRow">
                    <th style="border-bottom:1px solid #000000;">商品货号</th>
                    <th style="border-bottom:1px solid #000000;">商品名称</th>
                    <th style="border-bottom:1px solid #000000;">规格</th>
                    <th style="border-bottom:1px solid #000000;">单价</th>
                    <th style="border-bottom:1px solid #000000;">数量</th>
                    <th style="border-bottom:1px solid #000000;">金额</th>
                    <th style="border-bottom:1px solid #000000;" class="am-print-hide">操作</th>
                </tr>
                <!--loop{$info.order_items as $key => $vo}-->
                <tr>
                    <td style="border-bottom:1px solid #000000;">{$vo.goods_no}</td>
                    <td style="border-bottom:1px solid #000000;">{$vo.goods_name}</td>
                    <td style="border-bottom:1px solid #000000;">
                        <!--if{empty($vo.goods_options)}-->
                        无
                        <!--{else}-->
                        <!--loop{(array)$vo.goods_options as $v}-->
                        {$v.name}：{$v.value}&nbsp;
                        <!--{/loop}-->
                        <!--{/if}-->
                    </td>
                    <td style="border-bottom:1px solid #000000;"><span
                            style="font-family: sans-serif; font-size: 16px; font-style: normal; font-variant: normal; line-height: normal; text-align: center; white-space: normal;">{$vo.goods_price}</span>
                    </td>
                    <td style="border-bottom:1px solid #000000;" data-qty>{$vo.goods_qty}</td>
                    <td style="border-bottom:1px solid #000000;" data-price>{$vo.price_total}</td>
                    <td style="border-bottom:1px solid #000000;" class="am-print-hide">
                    <a href="javascript:;" data-del>删除</a>
                    </td>
                </tr>
                <!--{/loop}-->
                <tr>
                    <td style="border-bottom:0px solid #000000;">&nbsp;</td>
                    <td style="border-bottom:0px solid #000000;">&nbsp;</td>
                    <td style="border-bottom:0px solid #000000;">&nbsp;</td>
                    <td style="border-bottom:0px solid #000000;">合计</td>
                    <td style="border-bottom:0px solid #000000;" class="total_num"></td>
                    <td style="border-bottom:0px solid #000000;" class="total_price">/td>
                    <td style="border-bottom:0px solid #000000;" class="am-print-hide"></td>
                </tr>
                </tbody>
            </table>

        </div>
    </div>
</div>


<script>
    Do('base', 'print', function () {
        $("#print").bind("click", function (event) {
            $("#printArea").print();
        });
        $('[data-del]').on('click', function () {
            $(this).parents('tr').remove();
            total();
        });
        var total = function () {
            var qty = 0;
            $('[data-qty]').each(function () {
                qty += parseInt($(this).text());
            });
            $('.total_num').text(qty);
            var price = 0;
            $('[data-price]').each(function () {
                price += parseFloat($(this).text());
            });
            $('.total_price').text(price);
        };
        total();
    });
</script>